<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 

<head> 
<script type="text/javascript" src="scriptaculous-js-1.8.3/lib/prototype.js"></script>
<script type="text/javascript" src="scriptaculous-js-1.8.3/src/scriptaculous.js"></script>

	<style>
	/*struct style*/
	
	*{padding:0; margin:0;}
	a{ text-decoration:none; }
	ul{ text-align:center;}
	li{ list-style:none; display:inline;}
	img{ border:0;}
	
	/**
		form
	*/
	form .row{ margin:20px 0; clear:both; padding:2px; }

	form .row label {width:160px;float:left;display:block;}

	form .row input{ height:22px;font-size:125%;}
        form .row input[type=text] { width : 230px; }
        form .row input[type=password] { width : 230px; }
	
	form .row .text{}
	form .row .passwd{}
	
	form .captcha{ margin-left:30%;}
	
	form .submit{padding:5px; margin-top:40px; background:#cee;}
	
	/**			
		table
	*/
	table{ width:100%;border-collapse:collapse;}
		caption{
			padding:5px;
			width:100%;	 
			text-align:left;
			color:#999;
		}
		th{
			color: #4f6b72;
			background:#dee;
			border: 1px solid #C1DAD7;
		    letter-spacing: 3px;
			text-transform: uppercase;
			text-align: left;
			padding: 1px 1px 1px 2px;
			font-weight:lighter;
			font-size:90%;
		}
		td{
			border: 1px solid #C1DAD7;
			background: #fff;
			padding: 1px 1px 1px 2px;
			color: #4f6b72;
			font-size:80%;
		}
	
	
	.content{ width:96%; margin:auto; height:auto; }
	body{ width:100%; font-family:Comic Sans MS, Calibri, Arial, Helvetica, sans-serif; font-size:12px; }
	#pro_header{ width:100%; height:16px;border-bottom:1px dotted #bdd;}
		#pro_header *{ margin:0 5px 0 0;}
		#pro_header .sign{float:left; color:#069;}
		#pro_header .username{float:right;} 
		#pro_header a{color:#069;}
		#pro_header a:hover{text-decoration:underline;}
		
	
	#header { width:100%; height:70px;}
		#header .title{ font-size:250%; font-weight:lighter; color:#069; float:left;}
		#header .ico{ float:left; margin:5px; height:45px; width:45px; }
		#header .acm_icpc{ float:right; }
	
	#nav { height:19px; width:100%;font-size:115%;}
		#nav a{ margin: 0 15px; padding:0 10px;text-align:center; background:#bdd; color:#919191;}
		#nav .active{ background:#dee;}
		#nav a:hover{ background:#dee;}
	#sub_nav { height:19px; width:100%; background:#dee; font-size:115%;}
	
	#left{ width:15%; height:auto;float:left; margin:2px;}
		#left fieldset{ border:1px solid #069; padding:1px;}
		#left legend{ color:#069 ; }
	#main{ width:60%; float:left; margin:2px ; height:auto; font-family:Arial, Helvetica, sans-serif;}
	
	#right{ width:20%; height:auto; float:right; margin:2px; }
	
	#footer{ width:100%; text-align:center; color:#069; clear:both; border-top:1px dotted #ddd; }
	/*
		form style
	*/

	div.error{ background:#Fdd;color:#a00;padding:5px; margin:5px 0; font-size:120%;}

	#signin{ width:60%; height:auto; padding:2px; margin:2px; border:1px solid #bdd; font-family:Arial, Helvetica, sans-serif;}
		#signin form label{ color:#003366; font-size:125%; float:left; color:#006699;}
		#signin  legend{color:#069;padding:1px;}

	/**
		problem_list
	*/
	#problem_list{width:100%;}

		#problem_list .spec {
			border-left: 1px solid #C1DAD7;
			background:#eff;
			font-weight:lighter;
		}
	
	/**
		search for problems
	*/
		#problem_search{ width:100%; text-align:center; background:#eee;margin-top:15px;}
			#problem_search label{ color:#bbc; font-size:100%; text-transform:uppercase;}
			#problem_search input[type=text]{ border:1px solid #ddd;color:#666;}
			#problem_search select{ color:#666; border:1px solid #ddd;}
	
	/**
		pager
	*/
		#pager { width:100%; text-align:center;margin-top:5px; padding:1px;}
			#pager ul{ height:16px; padding:1px; margin:5px;}
			#pager li{ padding:1px; text-align:center;}
			#pager a{ padding:0 4px 0 4px;color:#069; border:1px solid #CCCCCC;}
			#pager a:hover{ background:#bdd; }
			
	/**
		problem_detail
	*/
		#problem_detail{width:100%;padding:1px;}
			#problem_detail .title{ width:100%; color:#336699; font-size:130%; text-align:center;}
			#problem_detail table{ width:60%;font-size:90%;float:left;}
			#problem_detail th{ text-transform:none; }
			
			#problem_detail fieldset{width:100%;height:auto;border:0;color:#666;}
			#problem_detail legend{color:#069;font-size:110%;}
		
			#problem_detail .submit{width:100%; padding:5px; margin-top:20px; background:#eee; text-align:center;}
	</style>
</head>

<body>

<!-- pro header -->
	<div id="pro_header">
		<div class="sign"><a href="#" >Sign in</a></div>
	<!--	<div class="sign"><a href="#">Sign out</a></div>
		<div class="username">Judasnow</div>
	-->
	</div>
<!-- header -->
	<div id="header">
		<div class="ico"><img src="images.jpeg" /></div>
		<div class="acm_icpc"><img src="acm_icpc.png" /></div>
		<div class="title">Suse acm/icpc online judge#lt?soj</div>
	</div>
	
<!-- dav -->
	<div id="nav">
	<ul>
		<li><a href="#">Home</a></li>
		<li><a href="#" class="active">Contest</a></li>
		<li><a href="#">Problem</a></li>
		<li><a href="#">Ranklist</a></li>
		<li><a href="#">Bbs</a></li>
		<li><a href="#">Hello world</a></li>
	</ul>
	</div>
	<div id="sub_nav">
	</div>
	
	
	<div id="left">
	
	</div>
	

	<div id="main">
		<fieldset id="problem_detail">
		<form action="#">
			<div class="title"><input type="text" >:<span><input type="text" ></span></div>
			<fieldset class="sumary">
				<legend>infomations about this problem</legend>
				
					<div class="row"><label>Time Limit</label><span id="time_limit"><input type="text" ></span></div>
					<div class="row"><label>Memory Limit</label><input type="text" ></div>
					<div class="row"><label>Judge type</label><input type="text" ></div>
					<div class="row"><label>Total Submit</label><input type="text" ></div>
					<div class="row"><label>Accepted Submit</label><input type="text" ></div>
					<div class="row"><label>Best user</label><input type="text" ></div>
					<div class="row"><label>source</label><input type="text" ></div>

			</fieldset>
			
			<fieldset>
				<legend>problem content</legend>
<textarea cols="100" rows="15">Farmer John's N (1 <= N <= 50) cows have invented a new kind of game to play with Farmer John. Farmer John picks two integers, K and I (both in the range 1..N). The cows arrange themselves into a circle. Then, starting with the Kth cow (going around the circle counterclockwise), cows are eliminated from the game. When a cow is eliminated, she leaves the circle and stands to the right (from our point of view) of the previous cow who was eliminated (the first cow stands alone, of course). Then the I-th cow after her going around the circle counterclockwise is eliminated, and so on. Each cow has a unique serial number in the range 1..10,000,000. Farmer John wins if the serial numbers of the cows are sorted (in ascending order) based on the order of elimination. Help FJ find K and I such that he comes as close to winning as possible. In other words, minimize the number of adjacent serial numbers that are out of order (the serial number of some cow is smaller than the serial number of the cow immediately to the left). </textarea>
			</fieldset>
			
			<fieldset>
				<legend>input</legend><p>
<textarea></textarea>
			</p></fieldset>
			
			<fieldset>
				<legend>output</legend><p>
<textarea></textarea>
			</p></fieldset>
			
			<fieldset>
				<legend>sample input</legend><p>
<textarea></textarea>
			</p></fieldset>
			
			<fieldset>
				<legend>sample output</legend><p>
<textarea></textarea>
			</p></fieldset>
			
			<fieldset>
			<legend>hite</legend><p>
<textarea></textarea>
			</p></fieldset>
			
			
			<div class="submit">
				<button value="submit">Save</button>
				<button >Load</button>
				<button >delete</button>
				<button >back</button>
			</div>
			
			
			
			
			
			
			
			
			
			
		</form>
		</fieldset>	
		
	</div>
	<div id="right"></div>
	
	<div id="footer">{?soj index page?}</div>
</body>

	 <script type="text/javascript">
	 
	 	new Ajax.InPlaceEditor(
			'time_limit',
			'do_problem_update.php',
			{
				formId: 'peob',
				okText: 'update'		
			}
		);
	 </script>
</html>
